<template>
  <div class="realm-info-lay">
    <el-form>
      <el-form-item label="租户名称" :label-width="labelWid">
        <el-input />
      </el-form-item>
      <el-form-item label="租户标识" :label-width="labelWid">
        <el-input />
      </el-form-item>
      <el-form-item label="公司名称" :label-width="labelWid">
        <el-input />
      </el-form-item>
      <el-form-item label="负责人姓名" :label-width="labelWid">
        <el-input />
      </el-form-item>
      <el-form-item label="负责人电话" :label-width="labelWid">
        <el-input />
      </el-form-item>
      <el-form-item label="租户描述" :label-width="labelWid">
        <el-input type="textarea" v-model="realmInfo.desc" :rows="3" />
      </el-form-item>
    </el-form>
    <div class="realm-footer">
        <el-button type="danger">取消</el-button>
        <el-button type="primary" style="margin-left: 32px;">保存</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
import {ref} from "vue";

const labelWid = ref(90);

const realmInfo = ref({
    desc: '小码科技'
});

</script>

<style scoped>
.realm-info-lay {
    display: flex;
    flex-direction: column;
    margin: 16px 32px;
    justify-content: flex-start;
    width: 50%;
}

.inherit-item {
  display: flex;
  flex-direction: row;
  margin: 0 8px;
  justify-items: center;
  align-items: center;
}

.realm-footer {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    margin: 16px 0;
}
</style>
